Categorías en la página de inicio

CC Categorías de documentación en la página principal de PrestaShop

Documentación completa para el módulo de visualización de categorías de la página de inicio de PrestaShop (cc_ps_home_categories) con opciones de estilo avanzadas, múltiples modos de visualización y control total sobre la apariencia de las categorías.

Índice

1. Introducción
2. Instalación
3. Activación de la licencia
4. Panel de gestión
5. Configuración general
6. Estilos de visualización
7. Configuración de imágenes
8. Selección de categorías
9. Personalización del aspecto
10. Capacidad de respuesta
11. Resolución de problemas
12. PREGUNTAS FRECUENTES

1. introducción

CC PrestaShop Categories Home es un módulo avanzado que le permite mostrar con elegancia las categorías en la página de inicio de su tienda. El módulo ofrece una amplia gama de estilos de visualización, desde cuadrículas clásicas a modernos deslizadores, que le da un control total sobre el aspecto y la funcionalidad.

Funciones principales del módulo:

• 7 estilos de cuadrícula diferentes (clásico, moderno, minimalista, de colores, elegante, modo oscuro, borde claro)
• Deslizador con navegación y soporte de gestos táctiles
• 3 modos de lista (horizontal, vertical, compacto)
• Control total sobre la selección de categorías
• Opciones avanzadas de imagen
• Diseño adaptable
• Sistema de licencias COCOS
• Servicio multilingüe
• Animaciones y efectos de transición
• Puede colocarse en varios enganches

2. instalación

Requisitos del sistema

• PrestaShop 1.7.0.0 o posterior
• PHP 7.2 o posterior
• MySQL 5.6 o posterior
• Permiso para instalar módulos
• 256 MB de RAM como mínimo (se recomiendan 512 MB)
• Extensión GD para el tratamiento de imágenes

Proceso de instalación

1. Descargue el archivo ZIP del módulo de la tienda oficial códigos.cocos
2. Inicie sesión en el panel de administración de PrestaShop
3. Vaya a: Módulos > Gestor de módulos > Añadir nuevo módulo
4. Haga clic en "Añadir módulo" y seleccione el archivo ZIP descargado.
5. Una vez finalizada la instalación, haga clic en "Configurar".
6. El módulo se registra automáticamente en la pantallaEnganche a casa

3. activación de la licencia

Antes de poder utilizar todas las funciones del módulo, es necesario activar la licencia:

1. Tras la instalación, proceda a la configuración del módulo
2. Seleccione la pestaña "Licencia
3. Introduzca la clave de licencia recibida tras la compra
4. Haga clic en "Activar licencia".
5. El sistema comprobará la validez de las licencias en los servidores COCOS
6. Tras la activación, aparecerá un mensaje de confirmación.

4 Panel de gestión

El panel de gestión del módulo consta de varias pestañas para una configuración completa:

Pestañas principales:

• Ajustes - configuración del módulo principal (sólo disponible con una licencia válida)
• Documentación - enlace a la documentación completa en línea
• Ayuda - Enlace a la página de asistencia técnica de COCOS
• Plug-ins - lista de extensiones COCOS disponibles
• Licencia - gestión de licencias de módulos

El sistema redirige automáticamente a la pestaña de licencias si la clave no está activa, lo que proporciona un proceso de configuración intuitivo.

5. ajustes generales

En la sección de ajustes generales encontrarás las opciones básicas que controlan el funcionamiento del módulo:

Configuración	Descripción	Valor por defecto
Encender el módulo	Visualización global on/off	En
Mostrar el título de la sección	Visualización de la cabecera sobre las categorías	En
Título de la sección	Texto de cabecera multilingüe	"Nuestras categorías"
Categoría límite	Número máximo de categorías (1-50)	6

Funcionalidad del interruptor principal

• En - las categorías son visibles en la página de inicio según la configuración
• Fuera de - el módulo no muestra ninguna categoría

6. estilos de visualización

El módulo ofrece 11 estilos diferentes de visualización de categorías, divididos en 3 grupos principales:

Estilos de cuadrícula

Estilo	Descripción	Uso recomendado
grid_classic	Tarjetas clásicas con marcos y sombras	Tiendas universales
cuadrícula_moderna	Fondo degradado con superposición de imágenes	Marcas modernas
cuadrícula_mínima	Tarjetas limpias y minimalistas	Tiendas Premium
grid_colorful	Marcos de colores con animaciones	Tiendas para niños/jóvenes
grid_elegant	Tarjetas elegantes con detalles dorados	Marcas de lujo
cuadrícula_oscura	Tema oscuro con efectos luminosos	Juegos/electrónica
grid_light_bordered	Tarjetas luminosas con bordes transparentes	Tiendas corporativas

Lista de estilos

Estilo	Descripción	Uso recomendado
lista_horizontal	Tarjetas con imágenes horizontales a la izquierda	Páginas de categorías principales
lista_vertical	Tarjetas verticales en columnas	Tramos estrechos
lista_compacta	Lista compacta con imágenes pequeñas	Barra lateral, pie de página

Estilos de deslizador

• slider_classic - Elegante deslizador con navegación y superposición hover

7. Configuración de las imágenes

El módulo ofrece un control total sobre la visualización de las imágenes de las categorías:

Tamaño de los contenedores

Talla	Altura	Recomendado para
pequeño	150px	Sistemas compactos
medio	250px	Pantalla estándar
grande	350px	Presentaciones impresionantes

Tipos de imágenes
El sistema detecta automáticamente los tipos de imagen disponibles definidos en PrestaShop para las categorías:

• categoría_por_defecto - tipo estándar para la categoría

Imágenes de reserva
Si una categoría no tiene una imagen asignada, el sistema muestra automáticamente una imagen sustitutiva por defecto no-image-category.jpg.

8 Selección de categorías

El módulo ofrece dos modos para seleccionar qué categorías mostrar:

Modo automático
El sistema selecciona automáticamente las principales categorías en función de su posición:

• Omite la categoría raíz (ID: 1)
• Saltar la categoría principal de la tienda
• Ordena por posición en el árbol de categorías
• Selecciona sólo las categorías activas
• Respeta el límite establecido

Modo manual
El administrador puede seleccionar manualmente categorías específicas:

• Lista de identificadores de categoría separados por comas
• Ejemplo: 2,5,8,12
• El sistema comprueba si las categorías existen y están activas
• Orden de visualización en la lista
• Omisión automática de categorías inexistentes

Validación de categoría
Sea cual sea el modo, el sistema lo comprueba:

• ¿Existe la categoría en la base de datos?
• ¿Está activa la categoría?
• ¿Tiene la categoría un nombre en el idioma actual?
• Si el usuario tiene permiso para verlo

9. ajustar la apariencia

Control de contenidos

Opción	Función	Por defecto
Mostrar nombres de categorías	Visualización de los títulos de las categorías	Activado
Mostrar descripciones de categorías	Visualización de descripciones (abreviadas)	Activado
Número de columnas	División en cuadrícula (1-6 columnas)	3

Comportamiento receptivo
El sistema ajusta automáticamente el número de columnas:

• Escritorio - número total de columnas
• Tableta - 2-3 columnas como máximo
• Móvil - siempre 1 columna

Efectos y animaciones

• Fundido durante la carga de la página
• Efectos Hover en las tarjetas
• Transiciones suaves
• Animaciones de desplazamiento
• Estados de carga de las imágenes

Capacidad de respuesta del control deslizante
Deslizar automáticamente:

• Ajusta el número de elementos visibles
• Compatible con gestyswipe en dispositivos táctiles
• Muestra/oculta la navegación según sea necesario
• Mantiene la relación de aspecto en diferentes pantallas

10 Capacidad de respuesta

El módulo es totalmente responsivo y se adapta automáticamente a diferentes tamaños de pantalla:

Puntos de interrupción

Dispositivo	Anchura	Columnas	Comportamiento
Escritorio	> 768px	Configuración completa	Pantalla estándar
Tableta	481-768px	Máximo 2-3	Diseño simplificado
Móvil	< 480px	1	Disposición vertical

Optimizaciones móviles

• Reducción automática del relleno y el margen
• Tipografía sensible
• Navegación táctil
• Tamaños de imagen optimizados
• Animaciones simplificadas

Estilos móviles para modos individuales

• Lista horizontal - se transforma en un
• Lista compacta - los elementos se apilan unos debajo de otros
• Deslizador - reduce la anchura de los elementos y el espaciado

11 Solución de problemas

Las categorías no aparecen en la página de inicio

1. Compruebe si el módulo está activado en los ajustes generales
2. Asegurarse de que la licencia está activa
3. Compruebe que las categorías seleccionadas están activas en PrestaShop
4. Borrar la caché de PrestaShop y del navegador
5. Comprueba que el hook displayHome es compatible con la plantilla

Los estilos CSS no se cargan

1. Compruebe que el archivo vistas/css/front.css hay
2. Asegúrese de que está en la página de inicio (controlador: IndexController)
3. Comprobación de conflictos con otros módulos
4. Desactivar la caché CSS en la configuración de PrestaShop
5. Compruebe los permisos de lectura de los archivos del módulo

El control deslizante no funciona correctamente

1. Compruebe si hay errores de JavaScript en la consola del navegador
2. Asegúrese de que el archivo views/js/front.js se carga
3. Comprobación de conflictos con jQuery
4. Desactivar otros módulos deslizantes durante las pruebas
5. Compruebe que los elementos tienen la estructura HTML correcta

Las imágenes no se muestran

1. Compruebe si las categorías tienen imágenes asignadas
2. Asegúrese de que el tipo de imagen seleccionado existe en el sistema.
3. Comprobar los permisos de directorio img/c/
4. Compruebe que el archivo no-image-category.jpg hay
5. Borrar caché de imágenes

Errores de licencia

1. Compruebe que la clave de licencia es correcta
2. Garantizar que el dominio cumple la licencia
3. Comprobar la conexión con los servidores COCOS
4. Borrar la caché del módulo
5. Póngase en contacto con el servicio de asistencia en caso de problemas de activación

12. PREGUNTAS FRECUENTES

¿Puedo utilizar varios estilos a la vez?
No, el módulo sólo permite seleccionar un estilo de visualización a la vez. Sin embargo, puedes cambiar fácilmente el estilo en los ajustes.

¿Cómo añado mi propio estilo de visualización?
Los nuevos estilos requieren la modificación de los archivos CSS y PHP. Le recomendamos que copie el estilo existente y lo adapte a sus necesidades.

¿Puedo mostrar subcategorías?
Actualmente, el módulo sólo admite categorías principales. La visualización de subcategorías requiere la modificación del código fuente.

¿Cómo puedo cambiar la posición de un módulo en la página?
El módulo se coloca automáticamente en el enganche displayHome en la primera posición. Puede cambiar el orden en el menú Posición del panel de módulos.

¿Funciona el módulo con caché?
Sí, el módulo es compatible con los sistemas de caché de PrestaShop y no requiere ninguna configuración especial.

¿Cómo traducir el título de la sección?
El campo "Título de la sección" admite todos los idiomas activos en la tienda. Cambie el idioma en el panel de administración e introduzca la traducción.

¿Puedo ocultar las descripciones de las categorías de determinados estilos?
La opción "Mostrar descripciones de categorías" funciona globalmente para todos los estilos. Algunos estilos (como grid_modern) muestran las descripciones en la superposición.

¿Por qué la barra deslizante muestra flechas de navegación cuando no son necesarias?
JavaScript oculta automáticamente las flechas cuando todos los elementos caben en la vista. Compruebe que los elementos tienen las dimensiones correctas.

¿Cómo funciona la carga diferida de imágenes?
Las imágenes se cargan automáticamente cuando se hacen visibles en la ventana gráfica. Esto ahorra ancho de banda y acelera la carga de la página.

¿Puedo cambiar la animación hover?
Las animaciones se definen en el CSS de cada estilo. Puede modificarlas editando el archivo front.css.

¿Por qué no se muestran algunas categorías?
El sistema omite las categorías inactivas, las categorías sin nombre y las categorías para las que el usuario no tiene derechos.

¿Cómo puedo cambiar la imagen por defecto de la categoría?
Sustituir el archivo views/img/no-image-category.jpg propia imagen de las mismas dimensiones.

¿El módulo admite RTL (de derecha a izquierda)?
El módulo utiliza clases estándar de Bootstrap que soportan RTL. Es posible que tenga que ajustar algunos de los estilos.

¿Cómo desactivo las animaciones?
Puede eliminar o comentar las animaciones CSS en el archivo front.css o añadir animación: ninguna; a los selectores correspondientes.

¿Puedo cambiar el número de descripciones de las categorías?
Las descripciones se acortan automáticamente a 80-120 caracteres dependiendo del estilo. Puede modificarlo en el archivo de plantilla home_categories.tpl.

¿Por qué no funciona el módulo después de una actualización de PrestaShop?
Compruebe la compatibilidad de la versión en el archivo del módulo. Es posible que necesites actualizar el módulo a la última versión.

¿Cómo optimizar el rendimiento de un gran número de categorías?
Utilice el modo de selección manual de categorías y limite el número a un máximo de 12 elementos. Activa la carga lenta y el almacenamiento en caché de imágenes.

¿Puedo utilizar el módulo en páginas de categorías?
El módulo está destinado a la página de inicio. La colocación en otras páginas requiere la modificación del hookew en el código fuente.

¿Cómo puedo comprobar qué conexiones están disponibles en mi plantilla?
Utilice el módulo "Hook displayer" o compruebe los archivos de plantilla en el directorio de plantillas. No todas las plantillas admiten todos los ganchos.

¿Por qué no se muestran correctamente los estilos en modo oscuro?
Los estilos oscuros requieren una envoltura especial. Compruebe que la plantilla no sobrescriba los colores de fondo y que no haya conflictos con otros estilos.

¿Cómo se exporta la configuración del módulo?
La configuración se almacena en una tabla ps_configuración con un prefijo CC_PS_HC_. Puede exportar estos registros a través de phpMyAdmin.

Si tiene una tienda en PrestaShop y desea mejorar la presentación de las categorías en la página de inicio, le recomendamos que utilice la función CC PrestaShop módulo Categorías en la página principalque proporcionará un aspecto profesional y un control total sobre cómo se muestran las categorías de productos.